package com.xi.jetcomposedemo.ui.compose

import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme.typography
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.xi.jetcomposedemo.ui.theme.Orange700
import com.xi.jetcomposedemo.ui.theme.Red500

@Composable
fun FollowBtn(modifier: Modifier) {
    val backgroundShape: Shape = RoundedCornerShape(4.dp)

    Text(
        text = "Follow",
        style = typography.bodyMedium.copy(color = Color.White),
        textAlign = TextAlign.Center,
        modifier = modifier
//            .preferredWidth(80.dp)
            .clickable(onClick = {})
            .shadow(3.dp, shape = backgroundShape)
            .clip(backgroundShape)
            .background(
                brush = Brush.verticalGradient(
                    colors = listOf(
                        Red500,
                        Orange700,
                    ),
                    startY = 0f,
                    endY = 80f
                )
            )
            .padding(6.dp)
    )
}
